<template>
  <Modal
      v-model="drawer.show" transfer
      :title="lang.title"
      :draggable="true"
      :width="800"
      :z-index="99"
      @on-ok="ok">
    <div v-if="drawer.show"  class="body-content">
      <cfg-statistics-instance-selection
          :page-size-opts="pageSizeOpts"
          :page-navigation="pageNavigation"
          :filtered="filtered"
          :add-button="addButton"
          :edit-button="editButton"
          :delete-button="deleteButton"
          @submit="submit"
      />
    </div>
  </Modal>
</template>

<script>
import CfgTemplateInstanceSelection from "./cfg-statTemplate-instance-selection";
export default {
  name: "cfgTwinsInstanceModal",
  components: {CfgTemplateInstanceSelection},
  data(){
    return {
      map:null
    }
  },
  props:{
    addButton:{
      default:()=>{
        return true
      }
    },
    editButton:{
      default:()=>{
        return true
      }
    },
    deleteButton:{
      default:()=>{
        return true
      }
    },
    drawer:{
      default:()=>{
        return {
          show:false
        }
      }
    },
    pageSizeOpts:{
      default:()=>{
        return [10, 30, 50, 100];
      }
    },
    pageNavigation:{
      default:()=>{
        return { total: 0, pageSize: 10, pageNumber: 1 };
      }
    },
    filtered:{
      default:()=>{
        return {};
      }
    },
  },
  computed:{
    lang(){
      return {
        "en-US": {
          title:'statistics instance',
          location:'location:statistics instance list',
        },
        "zh-CN": {
          title:'统计实例',
          location:'位置:统计实例列表',
        },
      }[this.G_Locale];
    }
  },
  methods:{
    submit(map){
      this.map=map;
      if(!!this.map){
        this.ok()
        this.drawer.show = false
      }
    },
    ok(){
      if(!!this.map){
        this.$emit('submit',this.map)
      }
    }
  }
}
</script>

<style scoped lang="scss">
  .address-outline {
    display: flex;
    padding:2px 5px;
    margin-top: -10px;
    border-bottom: 1px solid #e8eaec;
  }
  .body-content {
    padding: 2px;
    max-height: 800px;
    overflow-y: auto;
  }
</style>